<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.0.min.js"></script>
 <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<title>Insert title here</title>

<script type="text/javascript" src="${pageContext.request.contextPath }/js/top.js"></script>

<link href="${pageContext.request.contextPath }/css/top.css" rel="stylesheet" type="text/css" />

<style type="text/css">
body{margin:0px;padding-bottom:50px;
}
body div{border-radius:4px;
}
body img{border-radius:4px;
}
.topxi  .haveLogin div{float: right; line-height: 40px;height:100%;color:white;
}

.topxi .noLogin div{float: right; line-height: 40px;height:100%;color:white;
}

.midselect div{ background:url("images/1.jpg") no-repeat; background-size:100% 100%;
text-align: center;line-height: 43px;color:white; font-size: 22px;
font-weight:bold;
border-radius:0px 0px 0px 0px;
  -webkit-transition:color 0.7s,background 1s;
}
.midselect div:hover{color:yellow;background:url(images/2.jpg);
}


.main{background-color: white;
}
.main div{ 
border:1px solid #ccc;
}
body div{border:0px;
}
.tips div,tips{
float: left;
}

input[type='button']:hover{background-color: #f6ad90 !important;
}
</style>


<!-- 提示信息的出现于消失 -->
<script type="text/javascript">

	$(function(){
		
		$(".way0").text("有新分享");
		
		if("${size}"=="0"){
			$(".tipdiv").css('color','white');
		}else{
			$(".tipdiv").css('color','red');
		}
		
		var n = 5;
		
		$(".tipdiv").click(function(){
			n = 0;
			
		})
		
		$("body").click(function(){
			n = n+1;
			if(n == 1){
				$(".tips").css("display","block");
			}else{
				$(".tips").css("display","none");
			}
		})
		
		
		
	})
</script>





<script type="text/javascript">
	$(function(){
		if("${user.userID}"!=""){
			
			$('.topxi .haveLogin div').css('display', 'block');
			$('.topxi .noLogin div').css('display', 'none');
			$('#userName').html("${user.userName}");
			$('#headimage').attr("src", "${user.path}");
		}else{
			$('.topxi .haveLogin div').css('display', 'none');
			$('.topxi .noLogin div').css('display', 'block');
		}
	})
</script>

<!-- 改变颜色 -->




</head>
<body style = "background:url(images/200.png) ; background-size:100%; ">








<!-- 提示下拉框 -->
<div class = "tips" style = "position:fixed;left:1230px;top:40px;display:none;background-color: white;">
<!-- 	for循环 -->
	<c:forEach items="${tip }" var = "n">
		<a href = "${pageContext.request.contextPath }/${n.tipPath}&tipUserID=${n.tipUserID}&fromUserID=${n.fromUserID}&way=${n.way}" >
			<div class = "onetip" style  = "width:120px;height:30px;padding: 3px;">
				<div class = "fromuserhead" style = "width:30px;height:30px;border-radius:40px;">
					<img alt="" src="${n.path }" style = "width:100%;height:100%;border-radius:40px;">
				</div>
				<div class = "word6"  style = "margin-top: 5px;margin-left:5px;">
					<div class = "way${n.way }">有新消息!</div>
				</div>
			</div>
		</a>
	</c:forEach>
</div>



<!-- 其他信息提示框     **********************-->
<div class = "othertipdiv" style = "">
	<div class = "resetword" style = " " >
		<a href = "${pageContext.request.contextPath }/ResetServlet?userID=${user.userID}">
			▣个人信息
		</a>
	</div>
	<div class = "myshopword" style = " " href = "">
		<a href = "${pageContext.request.contextPath }/MyFlowerServlet">
			▣我的花店
		</a>
	</div>
	<div class = "myshopword" style = " " href = "">
		<a href = "${pageContext.request.contextPath }/FlowerShopServlet">
			▣花店商城
		</a>
	</div>
</div>






<!-- 最上方大图 -->
	<div class = "" style = "width: 100%;height:200px; background: url(images/10.jpg) no-repeat;background-size:100% 100%;">
		<!-- 最上方登录信息显示的细框 -->
		<div class = "topxi" style = "border-radius:0px;position:fixed; width:100%;height:40px; background-color: black; background: rgba(0, 0, 0, 0.4);">
<!-- 				已经登录 -->
		<div class="haveLogin">	
				<div class = "tipdiv" style = "cursor:pointer;font-weight: bold;line-height:40px;">
					新消息☎
					
				</div>
				<div class = "othertipword" style = "cursor:pointer;font-weight: bold;line-height:40px;float: left;margin-left: 200px;">
					▣其他选项
					
				</div>
				<div name = "return" style = "color:white;text-align: center; line-height: 40px;height:40px;"> <a href = "${pageContext.request.contextPath }/OutLoginServlet" style = "color:#ccc;padding-right: 10px;"> 退出登录 </a> </div>
				<div id = "userName" style ="width:200px;padding-left: 10px;">黄彬涛Boss
				</div>
				<div style = " width:50; height:100%">
					<img alt="" src="images/1.jpg" id="headimage" name = "path" style = "border-radius:35px 35px 35px 35px;width:40px; height:40px;">
				</div>
				<div style = "color:white;float: right;text-align: center;height:100%;line-height:40px;">  欢迎您！</div>

		</div>
		
<!-- 			未登录 -->
		<div class="noLogin">
			<div style ="padding-right: 100px;">
				<a href = "${pageContext.request.contextPath }/login.jsp" style = "color:white;"> 请先登录!!!</a>
			</div>
		</div>
				
				
		</div>
		
		
	</div>
<!-- 中方的框 -->
	<div style = "width:70%; height:50px; margin-left: 15%; margin-right: 15%;">
<!-- 		选项框 总 -->
		<div class = "midselect">
			<a href = "${pageContext.request.contextPath }/head.jsp"><div class = "selected1" style = "width:19.72%; height:43px; margin-left: ; margin-right: %;float: left;border-radius:7px 0px 0px 0px;" >
			首页
			</div></a>
			<a href = "${pageContext.request.contextPath }/ShowMyGoodsServlet?page=1"><div class = "selected2" style = "width:19.72%; height:43px; margin-left: ; margin-right: %;float: left;" >
			个人主页
			</div></a>
			<a href = "${pageContext.request.contextPath }/ConversationServlet"><div class = "selected3" style = "width:19.72%; height:43px; margin-left: ; margin-right: %;float: left;" >
			花卉论坛
			</div></a>
			<a href = "${pageContext.request.contextPath }/ShowPicServlet?page=1"><div class = "selected4" style = "width:19.72%; height:43px; margin-left: ; margin-right: %;float: left;" >
			植物图鉴
			</div></a>
			<a href = "${pageContext.request.contextPath }/ShareServlet?page=1"><div class = "selected5" style = "width:19.72%; height:43px; margin-left: ; margin-right: %;float: left;border-radius:0px 7px 0px 0px;" >
			分享交流
			</div></a>
			
			
		</div>
	
	
	</div>


</body>



</html>